import { ref } from 'vue';
import { pick } from 'lodash-es'

import { TextComponentProps } from '../defaultProps'

export type PartialTextComponentProps = Partial<TextComponentProps>

export const handleProps = <T extends { [key: string]: any }, K extends { [key: string]: any }>(newProps: T, defaultProps: K ): T => {
  let obj: { [key: string]: any } = {}
  Object.keys(newProps).forEach(key => {
    obj[key] = newProps[key] || defaultProps[key]
  })
  return obj as T
}

const useComponentCommon = <T extends { [key: string]: any }>(props: T, picks: string[]) => {
  const styleProps = ref(pick(props, picks))
  const handleClick = () => {
    // console.log(111111, props.actionType, props.url)
    if (props.actionType === 'url' && props.url) {
      window.location.href = props.url
      // styleProps.value.cursor = 'pointer'
    }
  }
  return {
    styleProps,
    handleClick
  }
}

export default useComponentCommon